import * as React from 'react';
import {NavigationContainer} from '@react-navigation/native';
import {createNativeStackNavigator} from '@react-navigation/native-stack';
import {Login} from './src/modules/LoginModule';
import {Tab} from './src/modules/TabModule';
import {StatusBar} from 'react-native';
import {RootSiblingParent} from 'react-native-root-siblings';
import {ActionSheetProvider} from '@expo/react-native-action-sheet';
import {Detail} from './src/modules/DetailModule';
import {Order} from './src/modules/OrderModule';
import {useSelector} from 'react-redux';
import {RootState} from './src/types';

const Stack = createNativeStackNavigator();

function AppPage() {
  const {initialRouteName} = useSelector((state: RootState) => state.app.app);
  if (!initialRouteName) {
    return <></>;
  }
  return (
    <ActionSheetProvider>
      <RootSiblingParent>
        <StatusBar barStyle="light-content" />
        <NavigationContainer>
          <Stack.Navigator
            initialRouteName={initialRouteName}
            screenOptions={{headerShown: false}}>
            <Stack.Screen name="Login" component={Login} />
            <Stack.Screen name="Tab" component={Tab} />
            <Stack.Screen name="Detail" component={Detail} />
            <Stack.Screen name="Order" component={Order} />
          </Stack.Navigator>
        </NavigationContainer>
      </RootSiblingParent>
    </ActionSheetProvider>
  );
}

export default AppPage;
